<template>
  <div class="internal">
    <navbar :text="text"></navbar>
    <div class="guide">
      <nav class="navigation">
        <li
          class="navigation-item"
          v-for="(item, index) in list"
          :key="index"
          @click="btnAction(index)"
          :class="{ active: value === index }"
        >
          {{ item }}
        </li>
      </nav>
      <!-- 就医须知 -->
      <div class="content" v-if="value === 0">
        <div class="notice">
          <h1>患者实名制挂号与注册建档须知</h1>
        </div>
        <div class="require">
          <p>
            <span>
              为保护病人权益，维护医院正常医疗秩序，请各位患友及家属自觉遵守病人实名注册建档、挂号、就诊规定。
            </span>
          </p>
          <p>
            <span>
              一、办理注册建档时，请选择以下方式之一提供病人基本信息：
            </span>
          </p>
          <p><span>1）出示病人本人的身份证原件（第2代身份证为佳）</span></p>
          <p><span>2）有效身份证明原件（户口本/驾驶证/老年证等）</span></p>
          <p><span>3）北京市医保卡</span></p>
          <p>
            <span>
              二、患者凭身份证或就医凭证挂号，必要时需同时出示病人有效身份证明。未经医师签名同意，不退号，不更名。
            </span>
          </p>
          <p>
            <span>三、每次就医时请随身携带身份证或就医凭证，妥善保管。</span>
          </p>
          <p>
            <span>
              四、严禁使用他人就医凭证挂号、就诊，一经发现就医凭证基本信息与患者真实身份不符，医院有权终止接诊，由此产生的一切不良后果由患者及家属自行承担。
            </span>
          </p>
          <p>
            <span>五、谨防“号贩子”冒用他人身份证、就医凭证进行非法倒号。</span>
          </p>
        </div>
      </div>
      <!-- 医保指南 -->
      <div class="content" v-else-if="value === 1">
        <div class="manual text">
          <p>
            <span>
              当您来我院就医时,请务必带上医保卡、北京市卫生局规定使用的《北京地区医疗机构门急诊病历手册》（以下简称《病历手册》）。无论是否在我院注册建档，在挂号前请您一定要主动出示医保卡先到建卡处去进行信息关联，然后再用医保卡挂号。无论您是通过银行卡、网络、114
              还是手机APP挂了号，请在就诊前务必持医保卡在医院自助机换取医保挂号条；否则此次所发生的门诊费用无处报销。
            </span>
          </p>
          <p><span>挂完号后请您持医保卡和《病历手册》到相关诊室就诊。</span></p>
          <p>
            <span>
              看完病后请您持医保卡到门诊挂号收费处结算当日的医疗费用，持卡结算时只需支付应由您个人自付、自费的费用。请您要仔细阅读收据、清单，尤其是明细清单中(丙)类、（全自付）的项目，有任何疑问请尽快与相关部门联系。请您妥善保留好医院出具的收据、明细清单和处方等相关材料，并保管好您的医保卡。
            </span>
          </p>
          <p>
            <span>
              再次提醒您：来我院看病时，务必做到持医保卡挂号、持医保卡就医、持医保卡结算,以保证您在我院所发生的医疗费用能实时报销。如果您来我院时没有持医保卡就医，那么这次所发生的医疗费用将不能报销，社保经办机构也不会再报销您这次所发生的医疗费用。
            </span>
          </p>
          <p>
            <span>
              如果您住院期间，有特殊原因需要到门诊发生费用时，请不要用医保卡挂号和交费，反之将导致住院费用无法报销，无处报销。
            </span>
          </p>
          <p>
            <span>
              若您因伤来院就诊，请如实告知受伤原因，如果因他人原因（即有相关责任人致伤的，如：交通事故等）导致的伤害须全额交费由责任方负责；工作原因导致的伤害（以后需要申请工伤的）须全额交费交本单位处理。
            </span>
          </p>
          <p>
            <span>
              当您因急诊未带卡或者是计划生育、工伤未做明确鉴定、企业欠费、补办医保卡期间就医时，所发生的医疗费用由个人全额垫付，再持相关票据按原渠道到社保经办机构报销。特别是企业欠费、补办医保卡期间门诊交费时一定要出示相关证明。
            </span>
          </p>
          <p>
            <span>
              为了方便您使用医保卡并了解相关信息，您可以通过北京市社保局的网站（www.bjld.gov.cn）和我院的自助服务终端机查询相关信息。也可拨打社会保障服务热线“96102”和“12333”进行查询或医保卡的挂失。
            </span>
          </p>
          <p>
            <span> 以上内容来源：摘自北京市人力资源和社会保障局相关文件 </span>
          </p>
          <p><span>北京医保患者就诊流程图</span></p>
        </div>
        <div class="visit-flowchart text">
          <img
            src="https://cdn7.axureshop.com/demo/1763441/images/%E5%B0%B1%E8%AF%8A%E6%8C%87%E5%8D%97/u3437.png"
            alt=""
          />
        </div>
        <div class="service-hotline text">
          <p><span>社会保障卡服务热线:96102（24小时）</span></p>
          <p><span>北京银行：95526</span></p>
          <p><span>北京市劳动保障咨询热线：12333</span></p>
          <p><span>还可咨询当地社保所</span></p>
          <p><span>门急诊报销药量温馨提示</span></p>
          <p><span>一.急诊：不超过3日量或一个最小包装量</span></p>
          <p><span>二.门诊：一般患者，不超过 7日量</span></p>
          <p>
            <span
              >&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;行动不便，不超过14日量
            </span>
          </p>
          <p>
            <span
              >&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;十大疾病，不超过30日量</span
            >
          </p>
          <p>
            <span
              >三.十大疾病：高血压、冠心病、糖尿病、结核、慢性肝炎、
              肝硬化、精神病、癌症、脑血管病、前列腺增生疾病，且病情稳定需长期服用同一类药物的,
              可放宽 到不超过一个月量。</span
            >
          </p>
          <p>
            <span
              >四.门诊特殊病：恶性肿瘤、肾透析、肾移植术后患者开药量不超过一个月。</span
            >
          </p>
          <p><span>摘自“2001年2月28日 京劳社医发[2001]23号”文。</span></p>
          <p><span>注：1.超出医保报销规定范围的药量将做自费处理。</span></p>
          <p><span>2.住院期间发生的门诊费用不能报销。</span></p>
          <p><span>3．公费医疗患者开药量比照医保政策执行</span></p>
        </div>
      </div>
      <!-- 医院位置 -->
      <div class="content" v-else-if="value === 2">
        <div class="address-text">
          <p><span>医院周边地图和交通</span></p>
        </div>
        <div class="address-text">
          <p><span>地址：北京市东城区xx街道xx号</span></p>
        </div>
        <div class="address-text hospital-address">
          <img
            src="https://cdn7.axureshop.com/demo/1763441/images/%E5%B0%B1%E8%AF%8A%E6%8C%87%E5%8D%97/u3441.png"
            alt=""
          />
        </div>
        <div class="address-text">
          <p><span>乘车路线：</span></p>
          <p><span>1. 106，108，110，111，116，到XX路口北</span></p>
          <p><span>2. 41，104，快到XX路口南</span></p>
          <p><span>3. 1，52，728，802，到XX路口西</span></p>
          <p><span>4. 10，20，25，37，39，到XX路口东</span></p>
          <p><span>5. 103，104，420，803，到XX路口东</span></p>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import navbar from "../../../components/navbar.vue";
export default {
  components: {
    navbar,
  },
  data() {
    return {
      text: "",
      list: ["就医指南", "医保指南", "医院位置"],
      value: 0,
    };
  },
  created() {
    this.text = this.$route.params.text;
  },
  methods: {
    btnAction(index) {
      this.value = index;
    },
  },
};
</script>

<style lang="scss" scoped>
@function vw($px) {
  @return ($px/375) * 100vw;
}
.guide {
  position: relative;
  z-index: 1;
  top: vw(44);
  left: 0;
  overflow: auto;
  height: 100%;
  &::-webkit-scrollbar {
    display: none;
  }
  .navigation {
    display: flex;
    height: vw(46);
    width: 100%;
    align-items: center;
    border-top: 1px solid rgba(242, 242, 242, 1);
    border-bottom: 1px solid rgba(242, 242, 242, 1);
    position: fixed;
    background-color: #fff;
    top: vw(44);
    left: 0;
    .navigation-item {
      height: 100%;
      width: 33.33%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-family: "微软雅黑";
      font-weight: 400;
      font-style: normal;
      font-size: vw(14);
      &:nth-child(2) {
        border-right: 1px solid rgba(242, 242, 242, 1);
        border-left: 1px solid rgba(242, 242, 242, 1);
      }
    }
    .active {
      color: #fff;
      background-color: #2ec7c9;
    }
  }
  .content {
    background-color: #fff;
    margin-top: vw(48);
    overflow: auto;
    padding-top: vw(26);
    padding-bottom: vw(65);

    // 就医须知
    .notice {
      padding-left: vw(20);
      h1 {
        font-family: "微软雅黑";
        font-weight: 400;
        font-style: normal;
        font-size: vw(16);
      }
    }
    .require {
      margin-top: vw(26);
      margin-left: vw(26);
      margin-right: vw(16);
      p {
        font-family: "微软雅黑";
        font-weight: 400;
        font-style: normal;
        line-height: vw(28);
        span {
          font-size: vw(13);
          color: #333333;
        }
      }
    }

    // 医保指南
    .text {
      margin-left: vw(15);
      margin-right: vw(15);
      p {
        font-family: "微软雅黑";
        font-weight: 400;
        font-style: normal;
        line-height: vw(28);
        span {
          font-size: vw(13);
          color: #333333;
        }
      }
    }
    .visit-flowchart {
      margin: 0 auto;
      margin-top: vw(20);
      margin-bottom: vw(20);
      height: vw(224);
      img {
        height: 100%;
      }
    }

    // 医院位置
    .address-text {
      margin-left: vw(15);
      p {
        font-family: "微软雅黑";
        font-weight: 400;
        font-style: normal;
        font-size: vw(14);
        padding-bottom: vw(14);
        span{
          color: #333333;
        }
      }
    }
    .hospital-address{
      text-align: center;
      margin-bottom: vw(20);
      height: vw(179);
      img{
        height: 100%;
      }
    }
  }
}
</style>
